<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <script type="text/javascript" src="js/jquery-3.2.1.min.js"></script>
    <script type="text/javascript" src="js/common.js"></script>
    <script type="text/javascript" src="js/battleground.js"></script>
    <link rel="shortcut icon" href="favicon.ico" />
    <link rel="stylesheet" type="text/css" href="css/battleground.css">
    <title>Z5COL BATTLE GROUND</title>
</head>
<body id="bdy">

    <div class="header" id="headDiv">
        <div class="headInner1 flex2">
            <label class="header">房间号码 </label>
            <input class="header" type="text" id="txtRoom" placeholder="起一个房间名称">
        </div>
        <div class="headInner flex2">
            <label class="header">阵营 </label>
            <div class="headInner">
                <span id="btnBlack" class="black header flex1">Black</span>
                <span id="btnWhite" class="white header flex1">White</span>
            </div>
        </div>
        <div class="headInner flex2">
            <label class="header">棋盘尺寸 </label>
            <input class="header" type="text" id="txtSize" value="15">
        </div>
        <span class="header btn flex1" id="btnConnect">Connect</span>
        <span class="header btn flex1" id="btnLogin">Login</span>
    </div>
    <p></p>
    <hr>
    <label class="connectTip hid">已连接至房间 </label><label class="connectTip hid" id="lblRoom"></label>
    <label class="connectTip hid">等待挑战者加入...</label>
    <p></p>

    <div id="container">
        <span class="btn" id="btnShare">邀请分享</span>
        <div id="battleGround"></div>
        <span class="btn" id="btnRollback">撤回棋子</span>
    </div>
    <input type="text" value="asd" id="code" readonly="true" style="opacity:0;position:fixed;top:255vmin">
</body>
</html>
